.em-blog-comment {
    margin-top: 32px;
    margin-bottom: 32px;
    .ui.comments {
        > .ui.dividing.header {
            margin-bottom: 0;
        }
        max-width: 100%;
        .comment {
            margin-top: 0;
            &:hover {
                background: rgba(0, 0, 0, .03);
                color: rgba(0, 0, 0, .8);
                .content {
                    .tools {
                        display: block;
                    }
                }
                &:before {
                    width: 4px;
                }
            }
            > .ui.divider {
                margin-bottom: 0;
            }
            .content {
                .actions {}
                .tms-blog-comment-edit-textarea {
                    width: 100%;
                }
                .textcomplete-container {
                    position: relative;
                    .append-to {
                        position: absolute;
                        left: 0;
                        bottom: 0;
                        width: 100%;
                    }
                }
                > .tools {
                    position: absolute;
                    right: 0;
                    bottom: 0;
                    display: none;
                    > .ui.button {
                        margin: 0;
                        background-color: rgba(224, 225, 226, 0.5);
                        &:hover {
                            background-color: rgba(224, 225, 226, 1);
                        }
                    }
                }
            }
            &.active {
                background-color: #f5f5f5;
                &:before {
                    width: 4px;
                }
            }
            &:before {
                content: "";
                position: absolute;
                z-index: -1;
                top: -2px;
                left: -4px;
                bottom: 1px;
                background: #2098D1;
                width: 0;
                -webkit-transition-property: width;
                transition-property: width;
                -webkit-transition-duration: 0.3s;
                transition-duration: 0.3s;
                -webkit-transition-timing-function: ease-out;
                transition-timing-function: ease-out;
            }
            &:nth-child(2) {
                &:before {
                    top: -1px;
                }
            }
        }
    }
    .CodeMirror {
        min-height: 60px;
    }
    .CodeMirror-scroll {
        min-height: 60px;
    }
    .dropzone {
        position: relative;
        .tms-blog-comment-status-bar-wrapper {
            position: relative;
            width: 100%;
            height: 0;
            .tms-blog-comment-status-bar {
                position: absolute;
                bottom: 0;
                left: 0;
                width: 100%;
            }
            .dropzone-previews {
                position: absolute;
                left: 0;
                bottom: -7px;
                width: 100%;
                .dz-preview {
                    width: 100%;
                    margin: 0;
                    .dz-progress {
                        height: 2px;
                        background-color: #aaa;
                        border: none;
                    }
                    .dz-remove {
                        display: none;
                    }
                }
            }
        }
    }
}
